
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-weight: 300;
}
body {
  font-family: 'Source Sans Pro', sans-serif;
  color: white;
  font-weight: 300;
}

.wrapper {

  /*background: linear-gradient(to right,#ee0979,#ff6a00);*/
  opacity: 0.8;
  position: fixed;

  left: 0;
  width: 100%;
  height: 100%;

  /*margin-top: 2.5%;*/
  overflow: hidden;
  z-index: -1;

}

.wrapper.form-success .container h1 {

          transform: translateY(85px);
}
/*.container {*/
  /*max-width: 600px;*/
  /*margin: 0 auto;*/
  /*padding: 200px 0;*/
  /*!*height: 1000px;*!*/
  /*text-align: center;*/
/*}*/
/*.container h1 {*/
  /*font-size: 40px;*/

  /*transition-duration: 1s;*/

  /*transition-timing-function: ease-in-put;*/
  /*font-weight: 200;*/
/*}*/
/*form {*/
  /*padding: 20px 0;*/
  /*position: relative;*/
  /*z-index: 5;*/
/*}*/
/*form input {*/
  /*-webkit-appearance: none;*/
     /*-moz-appearance: none;*/
          /*appearance: none;*/
  /*outline: 0;*/
  /*border: 1px solid rgba(255, 255, 255, 0.4);*/
  /*background-color: rgba(255, 255, 255, 0.4);*/
  /*width: 250px;*/
  /*border-radius: 3px;*/
  /*padding: 10px 15px;*/
  /*margin: 0 auto 10px auto;*/
  /*display: block;*/
  /*text-align: center;*/
  /*font-size: 18px;*/
  /*color: white;*/
  /*-webkit-transition-duration: 0.25s;*/
          /*transition-duration: 0.25s;*/
  /*font-weight: 300;*/
/*}*/
/*form input:hover {*/
  /*background-color: rgba(255, 255, 255, 0.4);*/
/*}*/
/*form input:focus {*/
  /*background-color: white;*/
  /*width: 300px;*/
  /*color: #53e3a6;*/
/*}*/
/*form button {*/
  /*-webkit-appearance: none;*/
     /*-moz-appearance: none;*/
          /*appearance: none;*/
  /*outline: 0;*/
  /*background-color: white;*/
  /*border: 0;*/
  /*padding: 10px 15px;*/
  /*color: #ee0979;*/
  /*border-radius: 3px;*/
  /*width: 250px;*/
  /*cursor: pointer;*/
  /*font-size: 18px;*/
  /*-webkit-transition-duration: 0.25s;*/
          /*transition-duration: 0.25s;*/
/*}*/
/*form button:hover {*/
  /*background-color: #f5f7f9;*/
/*}*/


:root {
  --grow-time: 5s;
  --fade-time: 3s;
}

/*body {*/
  /*overflow: hidden;*/
  /*!*padding-top: 80px;*!*/
  /*text-align: center;*/
/*}*/



.circle {
  -webkit-animation: grow var(--grow-time) forwards, fade var(--fade-time) calc(var(--grow-time) - var(--fade-time)) forwards;
  animation: grow var(--grow-time) forwards, fade var(--fade-time) calc(var(--grow-time) - var(--fade-time)) forwards;
  background: rgba(255, 255, 255, 0.25);
  border-radius: 100%;
  height: 2px;
  left: 20vw;
  position:fixed;
  top: 20vh;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  width: 2px;
  z-index: -999;
}

@-webkit-keyframes grow {
  0% {
    -webkit-transform: translateZ(0) scale(0);
    transform: translateZ(0) scale(0);
  }

  100% {
    -webkit-transform: translateZ(0) scale(100);
    transform: translateZ(0) scale(100);
  }
}

@keyframes grow {
  0% {
    -webkit-transform: translateZ(0) scale(0);
    transform: translateZ(0) scale(0);
  }

  100% {
    -webkit-transform: translateZ(0) scale(100);
    transform: translateZ(0) scale(100);
  }
}

@-webkit-keyframes fade {
  0% {
    opacity: 1;

  }

  100% {
    opacity: 0;
    color: rgba(255, 230, 163, 0.55);
  }
}

@keyframes fade {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}